<template>
	<div class="headbar-container" >
		<div class="headbar-top">
			<router-link :to="{ path: '/' }" class="headbar-logo"></router-link>
			<Button  @click="logout()" class="headbar-btn" size="small">退出登录</Button>
			<Button  @click="changePassword()" class="headbar-btn"  size="small">后台管理</Button>
			<div class="headbar-user">
				<p>{{leaderName}}</p>
			</div>

		</div>

	</div>
</template>

<script>
	export default {
		data() {
            const validatePass = (rule, value, callback) => {
                if (value === '') {
                    callback(new Error('请输入密码'));
                } else {
                    callback();
                }
            };
            const validatePassCheck = (rule, value, callback) => {
                if (value === '') {
                    callback(new Error('请再次输入密码'));
                } else if (value !== this.formCustom.passwd) {
                    callback(new Error('两次输入密码不一致!'));
                } else {
                    callback();
                }
            };
			return {
                countNumber:0,  //消息数量
				leaderName: CURRENT_LEADER.name,
				// 时间
				localYear: '',
				localMonth: '',
				localDate: '',
				localHour: '',
				localMin: '',
				showPoint: false,
				//修改密码
                modal1:false,
				userId:CURRENT_LEADER.userId,
                departmentCode:CURRENT_LEADER.departmentCode,
                formCustom: {
                    passwd: '',
                    passwdCheck: '',
                },
                ruleCustom: {
                    passwd: [
                        { validator: validatePass, trigger: 'blur' },
						{min: 6, message: '密码最少6位',trigger: 'blur'},
                    ],
                    passwdCheck: [
                        { validator: validatePassCheck, trigger: 'blur' }
                    ],
                }
			}
		},
		watch: {},
		created: function() {
            this.$Notice.config({
                top: 115,
            });

		},
		methods: {
			logout() {
				this.$http.get('/logout?random=' + Math.floor(Math.random() * 1000)).then(
					function(res) {
						var resBody = res.body
						var code = resBody.code;
						var msg = resBody.message
						if(code == 200) { //scuccess
							return location.href = '/login';
						}
						Vue.prototype.$Message.error("退出系统失败，请直接关闭浏览器.", 3)
					}
				)
			},
            changePassword(){
                this.modal1=true;
			},
            passwdCancel(){
                this.modal1=false;
                this.compileReset('formCustom');
			},
			//密码修改
            passwdConfirm(name){
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        var _this = this;
                        ezjsUtil.request(ezjsUtil.constants.api.staffManagement_modifyPassword,
                            {
                                id:_this.userId,
                                password:_this.formCustom.passwdCheck
                            },
                            function (err, data) {
                                if (err) {
                                    return;
                                }
                            }
                        )
                        _this.$Message.success('修改成功!');
                        _this.modal1=false;
                        _this.compileReset(name);
                    } else {
                        this.$Message.error('表单验证失败!');
                    }
                })
			},
            compileReset (name) {
                this.$refs[name].resetFields();
            },
			//登录查询是否有任务
            taskListGetNotVaildCount() {
                var _this = this;
                ezjsUtil.request(ezjsUtil.constants.api.taskList_getNotVaildCount,
                    {
                        departmentCode:_this.departmentCode
                    },
                    function (err, data) {
                        if (err) {
                            return;
                        }
                        if(data>0 && !_this.headstyleshow){
                            _this.$Notice.warning({
								name:'login',
                                title: '消息',
								desc: '<a href="/dashboard#/watchManagement/fireMission?name=1_3">您有紧急的任务单，请立即查收处理 ！</a>',
                                duration: 0
                            });
                            _this.infoPlay();
						}
                        _this.countNumber=data.toString();
                    }
                )
            },
            //查询是否有新任务
            taskListIm() {
                var _this = this;
                ezjsUtil.request(ezjsUtil.constants.api.taskList_Im,
                    {
                        departmentCode:_this.departmentCode
                    },
                    function (err, data) {
                        if (err) {
                            return;
                        }
                        if(data){
                            _this.$Notice.warning({
                                title: '消息',
                                desc: '您有紧急的任务单，请立即查收处理 ！',
                                duration: 0,
                            });
                            _this.infoPlay();
						}
                    }
                )
            },
			//消息声音播放
            infoPlay(){
                var audio = document.getElementById('music1');
                audio.currentTime = 0;
                audio.play();
			}
		},
        mounted() {
            this.taskListGetNotVaildCount();
            this.timer=setInterval(this.taskListIm,3000);
        },
        destroyed(){
            clearInterval(this.timer);
//            this.$Notice.close('login');
        }
	}
</script>

<style lang="less">
	.headbar-container {
		z-index: 999;
		height: 90px;
		background-color: #018dd6;
		.headbar-top {
			height: 90px;
			.headbar-logo {
				width: 486px;
				height: 41px;
				background: url("../../../assets/images/headbar/spsmts_logo_index.png") no-repeat;
				background-size: cover;
				float: left;
				margin: 24px 0 0 40px;
			}
			.headbar-time {
				float: right;
				height: 40px;
				margin-right: 50px;
				p {
					height: 40px;
					line-height: 40px;
					font-size: 16px;
					position: relative;
          color: #fff !important;
					span {
						position: absolute;
						display: block;
						width: 5px;
						height: 40px;
						top: -1px;
						left: 106px;
					}
				}
			}
			.headbar-btn {
				float: right;
				width: 100px;
				height: 30px;
				margin-top: 34px;
				margin-right: 28px;
				border-radius: 6px;
			}
			.headbar-btn_m {
				color: #fff;
			}
			.headbar-user {
				float: right;
				height: 40px;
				margin-top: 29px;
				margin-right: 50px;
				p {
					height: 40px;
					line-height: 40px;
					font-size: 16px;
          color:#fff;
				}
			}
			.infoM{
				float: right;
				margin-top: 17px;
				margin-right: 38px;
			}
		}
	}

	.headbar-container_m {
		background-color: #3299ff;
		color: #fff;
	}
	.ivu-badge-count-alone{
		display: inline;
		position: absolute;
		top: -10px;
		right: -15px;
	}
</style>
